import router from '@/router';
import setting from './setting';
//@ts-ignore
import nprogress from 'nprogress';
import 'nprogress/nprogress.css';
import useUserStore from './stores/modules/user';
import pinia from './stores';
import { analysisAccessToken } from '@/utils/token';
import type { RouteLocationNormalized, NavigationGuardNext } from 'vue-router';
nprogress.configure({ showSpinner: false });
const userStore = useUserStore(pinia);

//全局守卫:项目当中任意路由切换都会触发的钩子
//全局前置守卫
//to:你将要访问那个路由
//from:你从来个路由而来
//next:路由的放行函数
router.beforeEach(
  async (to: RouteLocationNormalized, from: RouteLocationNormalized, next: NavigationGuardNext) => {
    // 设置页面标题
    document.title = `${setting.title}`;
    // 打开加载进度条
    nprogress.start();

    const getPaths = userStore.getPaths;
    if (getPaths && getPaths.length > 0) {
      if (getPaths.includes(to.path)) {
        next();
      }
    }

    //获取token,去判断用户登录、还是未登录
    const token = userStore.token;
    //获取用户名字
    const user = userStore.user;
    // 判断token是否存在
    if (token && token.accessToken) {
      if (to.path === '/login') {
        next({ path: '/' });
      } else {
        //登录成功访问其余路由(登录排除)
        //有用户信息
        if (user && user.id && user.id !== '') {
          //放行
          next();
        } else {
          //如果没有用户信息,在守卫这里发请求获取到了用户信息再放行
          try {
            const payloadObj = analysisAccessToken(token.accessToken);
            // 服务器端获取用户信息
            await userStore.userInfo(payloadObj.sub);
            //放行
            //万一:刷新的时候是异步路由,有可能获取到用户信息、异步路由还没有加载完毕,出现空白的效果
            next({ ...to });
          } catch (error) {
            //token过期:获取不到用户信息了
            //用户手动修改本地存储token
            //退出登录->用户相关的数据清空
            await userStore.userLogout();
            next({ path: '/login', query: { redirect: to.path } });
          }
        }
      }
    } else {
      //用户未登录判断
      if (to.path == '/login') {
        next();
      } else {
        next({ path: '/login', query: { redirect: to.path } });
      }
    }
  }
);

//全局后置守卫
router.afterEach(() => {
  nprogress.done();
});

//第一个问题:任意路由切换实现进度条业务 ---nprogress
//第二个问题:路由鉴权(路由组件访问权限的设置)
//全部路由组件:登录|404|任意路由|首页|数据大屏|权限管理(三个子路由)|商品管理(四个子路由)

//用户未登录:可以访问login,其余六个路由不能访问(指向login)
//用户登录成功:不可以访问login[指向首页],其余的路由可以访问
